<template>
    <div>
        <a-modal
            centered
            :title="title"
            :width="1000"
            :visible="visible"
            @ok="handleOk"
            @cancel="handleCancel"
            cancelText="关闭">

            <!-- 查询区域 -->
            <div class="table-page-search-wrapper">
                <a-form layout="inline" @keyup.enter.native="searchQuery">
                    <a-row :gutter="24">
                        <a-col :span="10">
                        <a-form-item label="用户账号">
                            <a-input placeholder="请输入用户账号" v-model="queryParam.username"></a-input>
                        </a-form-item>
                        </a-col>
                        <a-col :span="8">
                                <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                                <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
                                <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
                                </span>
                        </a-col>
                    </a-row>
                </a-form>
            </div>
            <!-- table区域 -->
            <div>
                <a-table 
                    size="small" 
                    bordered 
                    rowKey="id" 
                    :columns="columns1"
                    :dataSource="dataSource1"
                    :pagination="ipagination"
                    :loading="loading"
                    :scroll="{ y: 240 }"
                    :rowSelection="{selectedRowKeys: selectedRowKeys,onSelectAll:onSelectAll,onSelect:onSelect,onChange: onSelectChange}"
                    @change="handleTableChange">>
                </a-table>
            </div>
        </a-modal>
    </div>
</template>
<script>
import {queryUserList} from '@/mock'
// import {JeecgListMixin} from '@/mixins/JeecgListMixin'
export default {
    name: 'SelectUserForm',
    // mixins: [JeecgListMixin],
    data() {
        return {
            title: '添加已有用户',
            visible: false,
            columns1: [
                {
                    title: '#',
                    dataIndex: '',
                    key: 'rowIndex',
                    width: 50,
                    align: 'center',
                    customRender: function (t, r, index) {
                         return parseInt(index) + 1;
                    }
                },
                {
                    title: '用户账号',
                    align: "center",
                    width: 100,
                    dataIndex: 'username'
                },
                {
                     title: '用户名称',
                    align: "center",
                    width: 100,
                    dataIndex: 'realname'
                },
                {
                     title: '性别',
                     align: "center",
                     width: 100,
                     dataIndex: 'sex_dictText'
                },
                {
                    title: '电话',
                    align: "center",
                    width: 100,
                    dataIndex: 'phone'
                },
                {
                    title: '部门',
                    align: "center",
                    width: 150,
                    dataIndex: 'orgCode'
                }
            ],
            // 定义data数据集
            dataSource1: [],
            // 分页参数
            ipagination: {
                current: 1,
                pageSize: 10,
                pageSizeOptions: ['10', '20', '30'],
                showTotal: (total, range) => {
                    return range[0] + "-" + range[1] + " 共" + total + "条"
                },
                showQuickJumper: true,
                showSizeChanger: true,
                total: 0
            },
            // 表格的loading
            loading: false,
            // 查询的请求参数
            queryParam: {},
            selectedRowKeys: []

        }
    },
    created() {
        queryUserList().then(res=>{
            this.dataSource1 = res.result.records;
        })
    },
    methods: {
        handleOk() {
            this.visible = false;
        },
        handleCancel() {
            this.visible = false;
        },
        loadData() {
            // querySelectedUserList().then(res=>{
            //     console.log(res);
            // })
            
        },
         show() {
        //   e.stopPropagation();/
            this.visible = true;
         },
        handleTableChange() {},
        onSelectChange() {},
        onSelect() {},
        onSelectAll() {},
        searchReset() {},
        searchQuery() {},
    },
}
</script>